<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- 防止大部分浏览器缓存： -->
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>

    <title>订单信息</title>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css">
    <link rel="stylesheet" href="css/index.css">


</head>
<body>

<div id="app" v-cloak>

    <!--订单信息-->
    <div v-show="hasInfo">

        <div>
            <!--标题-->
            <a class="mint-cell indent-a">
                <div class="mint-cell-wrapper">
                    <div class="mint-cell-title"><span class="mint-cell-text indent-title">订单信息</span></div>
                </div>
            </a>
            <mt-cell title="订单编号：" :value="indentInfo.order_sn"></mt-cell>
            <mt-cell title="卖家：" :value="indentInfo.seller_name"></mt-cell>
            <mt-cell title="买家：" :value="indentInfo.buyer_name"></mt-cell>
            <mt-cell title="支付方式：" :value="indentInfo.payment_name"></mt-cell>
            <mt-cell title="下单时间：" :value="indentInfo.add_time"></mt-cell>
        </div>

        <div class="indent-box">
            <!--标题-->
            <a class="mint-cell indent-a">
                <div class="mint-cell-wrapper">
                    <div class="mint-cell-title"><span class="mint-cell-text indent-title">商品信息</span></div>
                </div>
            </a>
            <div v-for="(item,index) in indentInfo.items">
                <div class="item-img">
                    <img :src="'http://data.ysmove.com/'+item.goods_image" alt="">
                </div>

                <div class="item-info">
                    <p>
                        <span class="item-name">{{item.goods_name}}</span>
                        <span class="item-price">￥{{item.price}}</span>
                    </p>
                    <p class="item-num">
                        <span>{{item.specification}}</span>
                        <span class="item-quantity">×{{item.quantity}}</span>
                    </p>
                </div>

            </div>
        </div>

        <div class="indent-box indent-money">
            <mt-cell title="商品金额：" :value="'￥'+indentInfo.order_amount"></mt-cell>
            <mt-cell title="折扣：" :value="'-￥'+indentInfo.discount"></mt-cell>
            <mt-cell title="运费：" :value="'+￥'+indentInfo.give_amount"></mt-cell>
            <mt-cell title="订单总额" :value="'￥'+indentInfo.goods_amount"></mt-cell>
        </div>

        <div class="indent-box">
            <!--标题-->
            <a class="mint-cell indent-a">
                <div class="mint-cell-wrapper shop-title-div">
                    <div class="mint-cell-title">
                        <img :src="storeInfo.store_logo" alt="" class="shop-img">
                        <span class="mint-cell-text">{{storeInfo.store_name}}</span>
                    </div>
                </div>
            </a>
            <mt-cell title="商家名称：" :value="storeInfo.store_name"></mt-cell>
            <mt-cell title="地址：" :value="storeInfo.address"></mt-cell>
            <mt-cell title="联系电话：" :value="storeInfo.tel"></mt-cell>
            <mt-cell title="描述：" :value="storeInfo.description"></mt-cell>
            <mt-cell title="店主姓名：" :value="storeInfo.owner_name"></mt-cell>
            <mt-cell title="手机号码：" :value="storeInfo.phone_mob"></mt-cell>
            <mt-cell title="email：" :value="storeInfo.email"></mt-cell>
        </div>

        <div class="indent-box">
            <!--标题-->
            <a class="mint-cell indent-a">
                <div class="mint-cell-wrapper">
                    <div class="mint-cell-title"><span class="mint-cell-text indent-title">用户评论</span></div>
                </div>
            </a>
            <mt-cell title="彼此：" value="商家服务很好~！"></mt-cell>
            <mt-cell title="dong566：" value="快递小哥很给力。"></mt-cell>
            <mt-cell title="吉大利_kiri：" value="商品品质很高，很满意"></mt-cell>
            <mt-cell title="淡淡的云：" value="商家多送了点小礼品，哈哈"></mt-cell>
        </div>

    </div>

    <!--绑定订单-->
    <div v-show="!hasInfo">
        <p class="hint-p">{{message}}</p>

        <mt-field label="订单号" placeholder="请输入订单号（必填）" v-model="order_sn"></mt-field>
        <mt-field label="溯源码" placeholder="请输入溯源码" v-model="trace_no" disabled></mt-field>
        <mt-field label="备注" placeholder="请输入备注" v-model="remark"></mt-field>

        <div class="btn-box">

            <mt-button type="primary" size="large" @click.native="submitBtn">确定</mt-button>

            <mt-button type="default" size="large" class="reset-btn" @click.native="resetBtn">重置</mt-button>

        </div>


    </div>


</div>


<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/vue.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/mint-ui/lib/index.js"></script>
<script src="js/index.js"></script>


</body>
</html>